<!-- 左侧底部 -->
<template>
  <div class="leftdown">
    <dv-border-box-12>
      <div class="carousel-box pd10">
        <span id="span-title">城-城市普查</span>
        <el-carousel :interval="3000" :loop="true">
          <el-carousel-item key="LeftDownOne_Detail">
            <LeftDownOne_Detail />
          </el-carousel-item>
          <el-carousel-item key="LeftDownTwo_Detail">
            <LeftDownTwo_Detail />
          </el-carousel-item>
        </el-carousel>
      </div>
    </dv-border-box-12>
  </div>
</template>

<script setup>
import LeftDownOne_Detail from "../home_detail/LeftDownOne_Detail.vue";
import LeftDownTwo_Detail from "../home_detail/leftdowntwo_detail.vue";
</script>
  
<style>
.leftdown {
  width: 100%;
  height: 350px;
  /* width: 85%;
  height:33%; */
  /* background-color: #14181e; */
  box-sizing: border-box;
  border-radius: 6%;
  display: flex;
  position: relative;
}

.carousel-box {
  height: 95%;
  width: 95%;
  background: rgba(4, 14, 17, 0.7);
  border-radius: 2%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  overflow: hidden;
}

.el-carousel__container .el-carousel__arrow {
  display: none;
}
</style>